﻿@using SimplCommerce.Module.Reviews.ViewModels
@model ReviewVm

<div class="container">
    <div class="row">
        @if (Model.ReviewsCount > 0)
        {
            <div class="col-md-5 rating-summary">
                <div class="row">
                    <div class="col-md-5">
                        <h4>@Localizer["Rating average"]</h4>
                        <p class="rating-average">@(Model.RatingAverage)/5</p>
                        <p>(@Model.ReviewsCount @Localizer["reviews"])</p>
                    </div>
                    <div class="col-md-7">
                        <div class="rating-item">
                            <span>5 @Localizer["stars"]</span>
                            <div class="progress">
                                <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="@Model.GetRatingPercent(Model.Rating5Count)" aria-valuemin="0" aria-valuemax="100" style="width: @Model.GetRatingPercent(Model.Rating5Count)%">
                                    <span class="sr-only">@Model.GetRatingPercent(Model.Rating5Count)%</span>
                                </div>
                            </div>
                            <span>@Model.Rating5Count</span>
                        </div>
                        <div class="rating-item">
                            <span>4 @Localizer["stars"]</span>
                            <div class="progress">
                                <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="@Model.GetRatingPercent(Model.Rating4Count)" aria-valuemin="0" aria-valuemax="100" style="width: @Model.GetRatingPercent(Model.Rating4Count)%">
                                    <span class="sr-only">@Model.GetRatingPercent(Model.Rating2Count)%</span>
                                </div>
                            </div>
                            <span>@Model.Rating4Count</span>
                        </div>
                        <div class="rating-item">
                            <span>3 @Localizer["stars"]</span>
                            <div class="progress">
                                <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="@Model.GetRatingPercent(Model.Rating3Count)" aria-valuemin="0" aria-valuemax="100" style="width: @Model.GetRatingPercent(Model.Rating3Count)%">
                                    <span class="sr-only">@Model.GetRatingPercent(Model.Rating3Count)%</span>
                                </div>
                            </div>
                            <span>@Model.Rating3Count</span>
                        </div>
                        <div class="rating-item">
                            <span>2 @Localizer["stars"]</span>
                            <div class="progress">
                                <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="@Model.GetRatingPercent(Model.Rating2Count)" aria-valuemin="0" aria-valuemax="100" style="width: @Model.GetRatingPercent(Model.Rating2Count)%">
                                    <span class="sr-only">@Model.GetRatingPercent(Model.Rating2Count)%</span>
                                </div>
                            </div>
                            <span>@Model.Rating2Count</span>
                        </div>
                        <div class="rating-item">
                            <span>1 @Localizer["stars"]</span>
                            <div class="progress">
                                <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="@Model.GetRatingPercent(Model.Rating1Count)" aria-valuemin="0" aria-valuemax="100" style="width: @Model.GetRatingPercent(Model.Rating1Count)%">
                                    <span class="sr-only">@Model.GetRatingPercent(Model.Rating1Count)%</span>
                                </div>
                            </div>
                            <span>@Model.Rating1Count</span>
                        </div>
                    </div>
                </div>
            </div>
        }
        <div class="col-md-7">
            <div id="addreview">
                @Html.Partial("/Modules/SimplCommerce.Module.Reviews/Views/Review/_ReviewForm.cshtml", new ReviewForm {EntityTypeId = Model.EntityTypeId, EntityId = Model.EntityId})
            </div>
        </div>
    </div>
    <hr/>
    <div id="reviews" class="review-item-list">
        @foreach (var review in Model.Items)
        {
            <div>
                <ul class="list-inline product-ratings">
                    <li><input value="@review.Rating" readonly="readonly" class="rating-loading" step="1" data-size="xs" data-show-clear="false" data-show-caption="false" /></li>
                    <li class="review-title">
                        @review.Title
                    </li>
                </ul>
                <p>@review.Comment</p>
                <p>By: <strong>@review.ReviewerName</strong> on <span>@review.CreatedOn</span></p>
            </div>
        }
    </div>
</div>